import {Directive, ElementRef, HostBinding, Input, Renderer2} from '@angular/core';
import {Seed} from "@shared/components/seed";

@Directive({
  selector: 'seed-icon'
})
export class IconDirective extends Seed {
  private _name: string;

  constructor(public elementRef: ElementRef,
              public renderer: Renderer2) {
    super(elementRef, renderer, 'seed-icon');
  }

  @Input()
  get name(): string {
    return this._name;
  }

  set name(value: string) {
    this._name = value;
    this.update();
  }

  @HostBinding('class.hide') _hide = false;

  update() {
    const iconName = this.name;
    const hidden = this._hide = (iconName === null);
    if (hidden) {
      return;
    }
    this.setElementClass(iconName);
  }
}
